<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>update</title>
</head>
<body>
<h3>修改品牌</h3>
<form method="post" action="#" id="update_form">
    <!--隐藏域，提交id
    <input type="hidden" name="id" value="1">
    品牌名称：<input name="brandName" value="xiaomi"><br>
    企业名称：<input name="companyName" value="小米"><br>
    排序：<input name="ordered" value="100"><br>
    描述信息：<textarea rows="5" cols="20" name="description">为发烧而生</textarea><br>
    状态：
      <input type="radio" name="status" value="1">启用
      <input type="radio" name="status" value="0">禁用
    <br>
    <input type="button" value="确认修改" id="btn"> <input type="reset" value="重置信息">-->
</form>
<!--导js-->
<script src="../js/axios-0.18.0.js"></script>
<script src="../js/getParamFromHtml.js"></script>
<script>
    //绑定页面加载完成事件
    window.onload = function () {
        //从brand.html页面获取请求参数
        let id = UrlParm.parm("id");
        axios.post("http://localhost:8080/cookiesession_case/selectByIdServletJson", {"id": id})
            .then(resp => {
                //处理响应数据
                let brand = resp.data;
                //填充表单数据-页面排版
                let formData1 =
                    '    <input type="hidden" name="id" value=' + brand.id + '>\n' +
                    '  品牌名称：<input name="brandName" value=' + brand.brandName + '><br>\n' +
                    '  企业名称：<input name="companyName" value=' + brand.companyName + '><br>\n' +
                    '  排序：<input name="ordered" value=' + brand.ordered + '><br>\n' +
                    '  描述信息：<textarea rows="5" cols="20" name="description">' + brand.description + '</textarea><br>\n' +
                    '  状态：\n'
                let formData2 = '';
                //判断状态是0还是1 --》0:禁用 1:启用
                if (brand.status === 1) {
                    formData2 =
                        '    <input type="radio" name="status" value="0">禁用\n' +
                        '    <input type="radio" name="status" value="1" checked>启用\n';
                } else {
                    formData2 =
                        '    <input type="radio" name="status" value="0" checked>禁用\n' +
                        '    <input type="radio" name="status" value="1">启用\n';
                }
                let formData3 =
                    '    <br><input type="button" value="确认修改" onclick="submitForm()"> <input type="reset" value="重置信息">';
                //填充表单数据-调用innerHTML函数
                document.getElementById("update_form").innerHTML = formData1 + formData2 + formData3;
            });
    };

    //绑定提交按钮点击事件
    function submitForm() {
        //获取表单数据
        let form = document.getElementById("update_form");
        //创建FormData对象
        let formData = new FormData(form);
        //创建JSON对象
        let jsonStr = {};
        //封装表单数据
        formData.forEach((k, v) => {
            jsonStr[k] = v;
        })
        //发送请求
        axios.post("http://localhost:8080/cookiesession_case/updateServletJson", jsonStr)
            .then(resp => {
                //处理响应
                if (resp.data === 'success') {
                    alert('修改成功！');
                    location.href = "/cookiesession_case/html/brand.html";
                }
            });
    };
</script>
</body>
</html>